<%-- 
    Document   : searchResult
    Created on : Dec 16, 2013, 11:15:32 PM
    Author     : Admin
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/xml" prefix="x"%>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="css/styles.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="js/jquery.js"></script>
        <title>Search Result</title>
    </head>
    <body>
        
        <c:import var="xml" url="WEB-INF/products.xml"/>
        <x:parse var="doc" xml="${xml}" scope="session"/>
        <div id="background">
            <!-- tiling image of the blue gradient at the top -->
            <div id="centre">
                <!-- splats and stars -->
                <div id="water_sand">
                    <!-- the tiling water and sand wave along the bottom -->
                    <div id="bottom">
                        <!--this is the underwater scene -->
                        <div id="wrapper">
                            <div id="header">
                                <div id="logo_birds">
                                    <div id="logo_container">
                                        <div id="logo"><img src="images/logo.png" width="262" height="64" alt="Logo" /></div>
                                    </div>
                                    <div class="left"></div>
                                    <div class="right"></div>
                                </div>
                                <!--end logo birds-->
                     
                                <!--end search blimp-->
                            </div>
                            <!--end header-->
                            <div id="menu_wrapper">
                                <div id="main_menu">
                                    <ul>
                                        <li><a href="index.jsp">home</a></li>
                                        <li><a href="products.html">products</a></li>
                                        <li> <a href="about.html">about</a></li>
                                        <li><a href="terms_faq.html">terms &amp; faq</a></li>
                                        <li class="noborder"><a href="contact.html">contact</a></li>
                                    </ul>
                                </div>
                                <!--end main menu-->
                                <div id="cart">
                                    <div class="left"></div>
                                    <div class="icon"><img src="images/icon_cart.png" width="33" height="31" alt="Cart" /></div>
                                    <ul class="text">
                                        <li><a href="#">0 items</a> <span class="white">|</span></li>
                                        <li><a href="#">$0.00</a> <span class="white">|</span></li>
                                        <li><a href="#">Checkout</a></li>
                                    </ul>
                                    <div class="right"></div>
                                </div>
                                <!--end cart-->
                            </div>
                            <!--end menu wrapper-->
                            <div id="container">
                                <div class="top"></div>
                                <div id="content">
                                    <div class="home_left">
                                        <p><a href="#"><img src="images/home_main_photo.jpg" alt="Home Main" width="688" height="193" border="0" class="home_large_image" /></a></p>
                                        <h1>Welcome to Kids Toys</h1>
                                        <ul class="product_list">
                                            <c:set var="search" value="${requestScope.SKEY}"/>          
                                            <x:forEach var="node" select="$doc//*[local-name()='product' and contains(productName,$search)]">
                                                <li>
                                                    
                                                    <!--start product thumb-->
                                                    <div class="product">
                                                        <div class="thumb"><a href="product_full.html"><img src="images/products_car.jpg" alt="Product Thumb" width="170" height="170" border="0" /></a></div>
                                                        <div class="title"><x:out select="$node/productName"/></div>
                                                        <div class="bottom">
                                                            <div class="tag"><img src="images/icon_tag.gif" width="16" height="16" alt="tag" /></div>
                                                            <div class="price">$<x:out select="$node/price"/></div>
                                                            <div class="addtocart"><img src="images/button_addtocart.gif" width="94" height="18" alt="Add to Cart" /></div>
                                                        </div>
                                                    </div>
                                                    <!--end product thumb-->
                                                </li>
                                            </x:forEach>
                                            <li>
                                                <!--start product thumb-->
                                                <!--end product thumb-->
                                            </li>
                                        </ul>
                                        <ul id="buttons">
                                            <li><a href="#"><img src="images/button_back.gif" alt="Back" width="122" height="38" border="0" /></a></li>
                                            <li> <a href="#"><img src="images/button_next.gif" alt="Next" width="122" height="38" border="0" /></a></li>
                                        </ul>
                                        <hr class="clear" />
                                    </div>


                                </div>
                                <!--end home left-->
                                <div class="home_right">
                                    <ul class="home_boxes">
                                        <li><a href="#"><img src="images/home_view_catalogue.jpg" alt="Latest Catalogue" width="244" height="193" border="0" /></a></li>
                                        <li><a href="#"><img src="images/home_terms.jpg" alt="Terms and FAQ" width="243" height="193" border="0" /></a></li>
                                        <li><a href="#"><img src="images/home_delivery.jpg" alt="Home Delivery" width="244" height="193" border="0" /></a> </li>
                                    </ul>
                                </div>
                                <!--end home right-->
                                <hr class="clear" />
                            </div>
                            <!--end content-->
                        </div>
                        <!--end main container-->
                        <div id="container_bottom"></div>

                    </div>
                    <!--end wrapper-->
                </div>
                <!--end bg pattern-->
            </div>
        </div>
    </div>

</body>
</html>
